<template>
    <section class="area_manage_form">
    	<el-form ref="form" :model="form" label-width="120px" >
				 <el-form-item :label="item.label"  v-for="(item,index) in formLabel" :key="index" v-if="type!='detail'">
				    <el-input :style="{'width':item.diyWidth}"  
				    	:disabled = "item.show==='disabled'"
				    	 v-if="item.type==='input'"
				    	  v-model="form[item.modelData]" 
				    	   :placeholder="item.placehold"></el-input>{{item.inputAfter}}
				    
					<el-select :style="{'width':item.diyWidth}"   v-if="item.type==='select'" 
						v-model="form[item.modelData]" 
						 @change="emitSelectType">
					    <el-option
					      v-for="optionsItem in item.options"
					      :key="optionsItem.id"
					      :label="optionsItem.name"
					      :value="optionsItem.id">
					    </el-option>
					</el-select>
					
					
					<el-input  v-if="item.type==='textarea'" type="textarea" v-model="form[item.modelData]"></el-input>
				 
				 	<el-radio-group  v-if="item.type==='radioGroup'" v-model="form[item.modelData]">
				      <el-radio-button :label="item.value" v-for="(item,index) in item.radios">{{item.name}}</el-radio-button>
				    </el-radio-group>
				 
				 
				 </el-form-item>
				    <!--<span class="ceshi" v-if="type!='detail'"><span>测试联通性</span>测试结果</span>-->
				  <el-form-item v-if="type!='detail'">
						    <el-button type="primary" @click="onSubmit">确定</el-button>
						    <el-button>取消</el-button>
			      </el-form-item>
			      
			        <el-form-item  :label="item.label+'：'"  v-for="(item,index) in formData"  v-if="type==='detail'">
			        	{{item.value}}
			        </el-form-item>
        </el-form>
    </section>
</template>

<script>
    
    export default {
    	props:{
	  		type:'',
	  		content:'',
	  		formLabel:Array,
	  		formData:Array
  		},
        data() {
          return {
          	form:{},
          	dbType:''
          };
        },
        methods: {
        	onSubmit(){
        		this.$emit('insertData',this.form)
        	},
        	emitSelectWangduan(val){
        		console.log(val);
        		this.$emit('emitSelectWangduan',val)
        	},
        	emitSelectType(val){
        		console.log(val);
        		if(val===1){
        			this.dbType ='db'	
        		}else{
        			this.dbType ='ftp'	
        		}
//      		this.$emit('emitSelectType',val)
        	}
        },
        watch:{
        	type(newVal){
        		console.log(newVal);
        	}
        }
  };
</script>

<style scoped="scoped">
	.ceshi span{
		margin: 0 17px 0 15px;
	    display: inline-block;
	    width: 110px;
	    background: #5a8bff;
	    text-align: center;
	    height: 30px;
	    line-height: 30px;
	    border-radius: 30px;
	    color: #fff;
	    margin-bottom: 15px
	}
</style>